<template>
    <div class="header">
        <div class="header-left">
            <img class="header-left-img" src="../../assets/img/header_logo.png" alt="">
        </div>
        <div class="header-input">
        </div>
        <div class="header-right">
            <img class="header-right-img" src="../../assets/img/header_app.png" alt="">
        </div>
    </div>
</template>

<script>
export default {
  name: 'HomeHeader'
}
</script>

<style lang="less" scoped>
@import '../../assets/styles/varbles.less';
.header{
    line-height: .4rem;
    background-color: @bgColor;
    display: flex;
    .header-left{
        // width: .64rem;
        float: left;
        text-align: center;
        .header-left-img{
          width: 1.6rem /* 80/50 */;
          height: .48rem /* 24/50 */;
        margin: .2rem /* 10/50 */;
        }
    }
    .header-input{
        flex: 1;
        height: .48rem;
        background-color: #fff;
        border-radius: .1rem;
        margin-top: .18rem;
        // margin-left: .2rem;
        line-height: .4rem;
        padding-left: .2rem;
    }
    .header-right{
        // width: 1.24rem;
        float: right;
        .header-right-img{
            width: 0.8rem;
            height: .4rem /* 40/50 */;
            margin: .2rem;
        }
    }

}
</style>
